<template>
    <n-form
        ref="formRef"
        :rules="formRule"
        :model="formData"
        size="large"
        label-width="auto"
        label-placement="left"
        require-mark-placement="right-hanging"
    >
        <n-form-item label="字典类型名称" path="name">
            <n-input v-model:value="formData.name" :minlength="1" :maxlength="100" clearable placeholder="请输入字典类型名称" :allow-input="(value) => !value.includes(' ')" />
        </n-form-item>
        <n-form-item label="字典类型编码" path="code">
            <n-input v-model:value="formData.code" :minlength="1" :maxlength="100" clearable placeholder="请输入字典类型编码" :allow-input="(value) => !value.includes(' ')" />
        </n-form-item>

        <n-divider />

        <n-space justify="end" size="large">
            <n-button @click="cancel">取消</n-button>
            <n-button @click="confirm" type="primary">确认</n-button>
        </n-space>

    </n-form>
</template>

<script setup lang="ts">
import {Api} from '@/api/type'
import {onMounted, ref} from 'vue'
import {BaseApi} from '@/api/base-api'
import {FormInst, FormRules, NButton, NDivider, NForm, NFormItem, NInput, NSpace, useMessage} from 'naive-ui'
// -------------------------------------------------
type R<T> = Api.Common.R<T>;
type Data = Api.System.DictType;
// -------------------------------------------------
const emit = defineEmits(['confirm', 'cancel'])

const {identity} = defineProps({
    identity: {
        type: String,
        default: ''
    }
})

const message = useMessage()
const baseApi = new BaseApi<Data>('dict-type')
const loading = ref<boolean>(false)
const formData = ref<Data>({
    identity: '',
    name: '',
    code: ''
})
const formRef = ref<FormInst | null>(null)
const formRule: FormRules = {
    name: [
        {
            required: true,
            message: '请填写字典类型名称',
            trigger: ['input', 'blur']
        },
        {
            min: 1,
            max: 100,
            message: '字典类型名称长度只能在1到50个字符之间',
            trigger: ['input', 'blur']
        }
    ],
    code: [
        {
            required: true,
            message: '请填写字典类型编码',
            trigger: ['input', 'blur']
        },
        {
            min: 1,
            max: 100,
            message: '字典类型编码长度只能在1到50个字符之间',
            trigger: ['input', 'blur']
        }
    ]
}

async function confirm() {
    if (formData.value.identity) {
        await modifyData()
    } else {
        await additionData()
    }
    emit('confirm')
}

async function cancel() {
    emit('cancel')
}

async function additionData() {
    await formRef.value?.validate()
    loading.value = true
    let result = await baseApi.additionData(formData.value)
    if (result.code == 0) {
        message.success('添加字典类型成功')
    } else {
        message.error('添加字典类型失败.' + result.message)
    }
    loading.value = false
}

async function modifyData() {
    await formRef.value?.validate()
    loading.value = true
    let result = await baseApi.modifyData(formData.value)
    if (result.code == 0) {
        message.success('修改数据成功')
    } else {
        message.error('修改数据失败.' + result.message)
    }
    loading.value = false
}

async function getDataInfo(identity: string): Promise<Data | null> {
    loading.value = true
    let result: R<Data> = await baseApi.getDataInfo({identity: identity})
    loading.value = false
    if (result.code == 0) {
        return result.data
    } else {
        console.error(message)
        message.error(result.message)
        return null
    }
}

async function initialize() {
    if (identity) {
        let data = await getDataInfo(identity)
        if (data) {
            formData.value = data
        } else {
            console.error('查询数据失败')
            message.error('查询数据失败')
        }
    }
}

onMounted(() => {
    initialize()
})
</script>
